import React from 'react';

import MToolbar from 'material-ui/lib/toolbar/toolbar';
import ToolbarGroup from 'material-ui/lib/toolbar/toolbar-group';
import ActionHome from 'material-ui/lib/svg-icons/action/home';
import NavMenu from 'material-ui/lib/svg-icons/navigation/menu';
import IconButton from 'material-ui/lib/icon-button';

import { IndexLink } from 'react-router';

import * as ToolbarStyle from './Toolbar.less';

const ActionHomeStyle = {
	height: 56,
	width: 56
}

export default class Toolbar extends React.Component {
	static propTypes = {
		onToggleNavigator: React.PropTypes.func
	};

	constructor(props) {
		super(props);
	}

	render() {
		let { onToggleNavigator } = this.props;

		return (
			<MToolbar className={ToolbarStyle.toolbar}>
				<ToolbarGroup float='right'>
					<IndexLink to='/app'>
						<IconButton style={ActionHomeStyle} tooltip='返回首页'>
							<ActionHome />
						</IconButton>
					</IndexLink>
					<IconButton style={ActionHomeStyle} tooltip='导航' onTouchTap={onToggleNavigator}>
						<NavMenu />
					</IconButton>
				</ToolbarGroup>
			</MToolbar>
		);
	}
}